$rem:1rem;
@mixin  size($width,$height,$back){
	width:$width;
	height:$height;
	background:$back no-repeat;
}
@mixin bgs($width){
	background-size:$width/75*$rem 100%;
}
@mixin margin($top,$left){
	margin-top:$top/75*$rem;
	margin-left:$left/75*$rem;
}
@mixin pad($top,$left){
	padding-top:$top/75*$rem;
	padding-left:$left/75*$rem;
}
@mixin flex($space,$item){
    display: flex;
    justify-content: $space;
    align-items: $item;
}
@mixin font($font,$line,$color){
	font-size:$font/75*$rem;
    line-height:$line/75*$rem;
    color:$color;
}
@mixin border($color){
	
}
@mixin po($top,$left,$index){
	position:absolute;
	top:$top/75*$rem;
    left:$left/75*$rem;
    z-index:$index;
}
@mixin border-1px($color){
    left: 0;
    bottom: 0;
    border-top:1px solid $color;
    width: 100%;
    content: '';
    }

 @-webkit-keyframes move {
 	0% {
 	
 	}
 	30% {
 	
 	}
 }
em {
	font-style:normal;
}
body {
	position:relative;
	resize:both;
	z-index:0;
}
.border-1{
	@include border-1px(#f3f5f7);
} 
.fl{
	float:left;
}
.fr{
	float:right;
}
.clearfloat::after{
	content:'';
	display:block;
	clear:both;
}
i {
	font-style:normal;
}
body {
    background:#fff!important;
}
html {
    font-size: 100%;
}

#app {
    height: 100%;
    width: 100%;
    position: relative;
}

.index-data {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;

    .mainimg {
        display: inline-block;
        max-height:355/75*$rem!important;
        cursor: pointer;
    }
    
    .loadOver {
        padding: 15px 0;
        text-align: center;
        color: #999999;
        font-size: 14px;
        overflow: hidden;
        margin-bottom: 0/75*$rem;
    }
    .source_details {
        -webkit-overflow-scroll:touch ;
        // @include pad(16,0);
        // padding-bottom: 100/75*$rem;
        // background-color: #f7f7f7;
        .source_imggroup{
            position: relative;
            cursor: pointer;
            margin-bottom: 2/75*$rem;
            .source_default_groups{
                position: relative;
                @include size(750/75*$rem,422/75*$rem,none);
                .playicon{
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    margin-left:-54/75*$rem;
                    margin-top:-54/75*$rem ;
                    @include size(108/75*$rem,108/75*$rem,none);
                }
                .mask {
                    position: absolute;
                    bottom: 0;

                    @include size(750/75*$rem,211/75*$rem,none);
                    background-image: linear-gradient(-180deg, rgba(255,255,255,0.00) 0%,  rgba(0,0,0,0.30) 100%);
                }
                .source_default {
                    display: inline-block;
                    @include size(100%,422/75*$rem,none);
                }
            }
            .source_imgdetail {
                @include size(100%,108/75*$rem,none);
                padding-left: 32/75*$rem;
                position: absolute;
                bottom: 0;
                z-index: 2;
                text-overflow: ellipsis;
                white-space:nowrap;
                overflow: hidden;
                color: #fff;
                strong {
                    @include font(34,48,#fff);
                    // font-family: PingFangSC-Medium;
                    // letter-spacing:3/75*$rem ;
                    // letter-spacing:1px;
                }
                .guest_source {
                    // font-family:PingFangSC-Regular;
                    @include margin(6,0);
                    @include font(24,34,#fff);
                    .guest_count_img{
                        @include size(34/75*$rem,32/75*$rem,none);
                        margin-right: 3/75*$rem;
                        margin-top: 1/75*$rem;
                        cursor: pointer;
                    }
                    .guest_count{
                        margin-left:24/75*$rem ;
                    }
                }
            }
        }
        .goodsgroup{
            @include size(750/75*$rem,190/75*$rem,#fff);
            padding-left: 20/75*$rem;
            padding-top: 40/75*$rem;
            border-bottom: .5px solid #EAEDEF;
            cursor: pointer;
            .source_imgdetail{
                color: #BDBDBD;
                @include size(464/75*$rem,auto,none);
                .sourceTitle_group{
                    height:88/75*$rem;
                    strong {
                        @include font(32,44,#303030);
                        // font-family: PingFangSC-Medium;
                        // letter-spacing:3/75*$rem ;
                        // letter-spacing:1px;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        overflow:hidden;
                    }
                }
                .guest_source{
                    @include size(auto,34/75*$rem,none);
                    margin-top: 6/75*$rem;
                    cursor: pointer;
                    color: #BDBDBD;
                    img {
                        @include size(34/75*$rem,32/75*$rem,none);
                        margin-right: 3/75*$rem;
                        margin-top: 1/75*$rem;
                    }
                    @include font(24,34,#BDBDBD);
                    .guest_count{
                        margin-left:24/75*$rem ;
                        cursor: pointer;
                    }
                }
                
            }
            .goodsshort {
                margin-right: 20/75*$rem;
                @include size(214/75*$rem,120/75*$rem,none);
                position: relative;
                cursor: pointer;
                .goodspic {
                    display: inline-block;
                    @include size(214/75*$rem,120/75*$rem,none);
                    cursor: pointer;
                    border-radius: 8/75*$rem;
                }
                .playpic {
                    position: absolute;
                    top:50% ;
                    left:50% ;
                    margin-left:-26/75*$rem;
                    margin-top:-26/75*$rem;
                    @include size(52/75*$rem,52/75*$rem,none);
                    cursor: pointer;
                }
            }
        }
        .last{
            border-bottom: none;
        }
    } 
   
    
    
}
.none_data{
    width: 100%;
    position: absolute;
    text-align: center;
    color: #bf9595;
    font-size: 14px;
    margin-top: 80px;
    img {
        display: inline-block;
        width: 57px;
        margin-bottom: 10px;
    }
    p{
        text-align: center;
        color:#999 ;
        font-family: '微软雅黑';
        @include font(30,50,#999);
    }
}